import type { App } from 'vue'
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import { createRouterGuards } from '@/router/routerGuards'
import { SUPER_ADMIN, ADMIN, USER } from '@/store/constantKeys'
import Layout from '@/layout/index.vue'

// default routers all role can visit
export const constantRoutes: Array<RouteRecordRaw> = [
  {
    path: '/redirect/:path*',
    name: 'Redirect',
    component: () => import(/* webpackChunkName: "redirect" */ '@/layout/redirect'),
    meta: {
      title: '刷新中...',
      hidden: true,
      keepAlive: false
    }
  },
  {
    path: '/404',
    name: '404',
    component: () => import(/* webpackChunkName: "404" */ '@/layout/404/index.vue'),
    meta: {
      title: '404',
      hidden: true,
      keepAlive: false
    }
  },
  {
    path: '/login',
    name: 'Login',
    component: () => import(/* webpackChunkName: "login" */ '@/views/login/index.vue'),
    meta: {
      title: '登录',
      hidden: true,
      keepAlive: false
    }
  },
  {
    path: '/',
    name: 'Layout',
    redirect: '/dashboard',
    component: Layout,
    meta: {
      title: '首页',
      icon: 'icon-dashboard',
      hidden: false,
      keepAlive: true
    },
    children: [
      {
        path: 'dashboard',
        name: 'Dashboard',
        component: () => import(/* webpackChunkName: "dashboard" */ '@/views/dashboard/index.vue'),
        meta: {
          title: '首页',
          hidden: false,
          keepAlive: true,
          icon: 'icon-dashboard'
        }
      }
    ]
  }
]

// async routers base on role visit
export const asyncRoutes: Array<RouteRecordRaw> = [
  {
    path: '/async-path',
    name: 'AsyncPath',
    redirect: '/async-path/index',
    component: Layout,
    meta: {
      title: '动态路由',
      hidden: false,
      keepAlive: true,
      roles: [SUPER_ADMIN, ADMIN, USER],
      icon: 'icon-edit-square'
    },
    children: [
      {
        path: 'index',
        name: 'AsyncPathIndex',
        component: () => import(/* webpackChunkName: "async-path-index" */ '@/views/asyncPath/index.vue'),
        meta: {
          title: '动态路由',
          hidden: false,
          keepAlive: true,
          roles: [SUPER_ADMIN, ADMIN, USER]
        }
      },
      {
        path: 'index-index',
        name: 'AsyncPathIndex-index',
        component: () => import(/* webpackChunkName: "async-path-index" */ '@/views/asyncPath/index.vue'),
        meta: {
          title: '动态路由-index',
          hidden: true,
          activeMenu: '/async-path/index',
          keepAlive: true,
          roles: [SUPER_ADMIN, ADMIN, USER]
        }
      },
      {
        path: 'index-index2',
        name: 'AsyncPathIndex-index2',
        component: () => import(/* webpackChunkName: "async-path-index" */ '@/views/asyncPath/index.vue'),
        meta: {
          title: '动态路由-index2',
          hidden: false,
          keepAlive: true,
          roles: [SUPER_ADMIN, ADMIN, USER]
        }
      }
    ]
  },
  {
    path: '/:pathMatch(.*)*',
    name: 'NotFound',
    redirect: {
      name: '404'
    },
    meta: {
      title: 'NotFound',
      hidden: true,
      roles: [SUPER_ADMIN, ADMIN, USER]
    }
  }
]

const router = createRouter({
  // process.env.BASE_URL
  history: createWebHistory(''),
  routes: constantRoutes,
  scrollBehavior: () => {
    return {
      top: 0,
      behavior: 'smooth'
    }
  }
})

export function setupRouter (app: App) {
  app.use(router)
  // 创建路由守卫
  createRouterGuards(router)
}

export default router
